<template>
	<view class="cyyBox">
		<view class="cyyitem" v-for="(e,i) in cyylist" :key="i">
			<view class="name">
				{{e.title}}
			</view>
			<view class="editBox">
				<view class="edit" @tap="gotoeditcyy(e)">
					编辑
				</view>				
			</view>
		</view>
		<view class="addBox">
			<view class="addcyy" @tap="gotoaddcyy">
				添加常用语
			</view>			
		</view>
	</view>
</template>

<script>
	import api from '@/common/api.js'
	import {
		req
	} from '@/common/vmeitime-http/'
	export default {
		data() {
			return {
				cyylist:[]
			}
		},
		onShow() {
			this.getcyy();
		},
		methods: {
			getcyy(){
				const par = {
					pageNo:1,
					pageSize:1000,
				}
				console.log(par);
				req('GET',api.getcyy,par).then(e=>{
					this.cyylist = e.result.records
				})
			},
			gotoaddcyy(){
				uni.navigateTo({
					url: `/pages/im/conversation/addCyyPage`,
				});
			},
			gotoeditcyy(e){
				uni.navigateTo({
					url: `/pages/im/conversation/addCyyPage?type=edit&id=${e.id}`,
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
.cyyBox{
	width: 100%;
	height: calc(100% - 60px);
	// position: relative;
	overflow-y: overlay;
	.cyyitem{
		width: 100%;
		.name{
			width: 100%;
			padding-left: 10px;
			box-sizing: border-box;
		}
		.editBox{
			width: 100%;
			text-align: right;
			padding-right: 10px;
			display: flex;
			justify-content: flex-end;
			.edit{
				box-sizing: border-box;
				padding: 5px 20px;
				border: 1px solid #333;
				border-radius: 8px;
				width: fit-content;
			}
		}
	}
	.addBox{
		width: 100%;
		height: 60px;
		background-color: #fff;
		position: absolute;
		bottom: 0;
		left: 0;
		.addcyy{
			width: fit-content;
			margin: 0 auto;
			padding: 10px 20px;
			border: 1px solid #333;
			border-radius: 8px;
			margin-bottom: 10px;
		}
	}
}
</style>
